<template>
  <!--      输入框-->
  <!--    <el-dialog-->
  <!--        :title="title"-->
  <!--        @close="resetForm('emp')"-->
  <!--        :visible.sync="dialogAddVisible"-->
  <!--        width="80%">-->
  <div>
    <div>
      <el-form :model="emp" :rules="rules"  ref="empForm">
        <el-row>
          <!--            <el-col :span="8">-->
          <!--              <el-form-item label="编号:" prop="id">-->
          <!--                <el-input size="mini" style="width: 250px" prefix-icon="el-icon-user-solid"-->
          <!--                          v-model="emp.id" placeholder="编号" clearable></el-input>-->
          <!--              </el-form-item>-->
          <!--            </el-col>-->
          <el-col :span="8">
            <el-form-item label="姓名:" prop="name">
              <el-input size="mini" style="width: 250px" prefix-icon="el-icon-user" v-model="emp.name"
                        placeholder="请输入员工姓名" clearable></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="密码:" prop="password">
              <el-input size="mini" style="width: 250px" prefix-icon="el-icon-lock" v-model="emp.password"
                        placeholder="请输入密码" clearable></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="员工类型:" prop="employee_type">
              <el-select v-model="emp.employee_type" placeholder="员工类型" size="mini" style="width: 223px;">
                <el-option v-for="item in employee_types" :key="item" :label="item" :value="item"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <!--            <el-col :span="8">-->
          <!--              <el-form-item label="姓名:" prop="name">-->
          <!--                <el-input size="mini" style="width: 250px" prefix-icon="el-icon-user" v-model="emp.name"-->
          <!--                          placeholder="请输入员工姓名" clearable></el-input>-->
          <!--              </el-form-item>-->
          <!--            </el-col>-->
          <el-col :span="8">
            <el-form-item label="所学专业:" prop="major_studied">
              <el-input size="mini" style="width: 223px" prefix-icon="el-icon-notebook-1"
                        v-model="emp.major_studied" placeholder="请输入专业名称" clearable></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="性别:" prop="sex">
              <el-radio-group v-model="emp.sex">
                <el-radio label="男">男</el-radio>
                <el-radio label="女">女</el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="出生日期:" prop="birthday">
              <el-date-picker
                  v-model="emp.birthday"
                  size="mini"
                  type="date"
                  value-format="yyyy-MM-dd"
                  style="width: 220px;"
                  placeholder="出生日期">
              </el-date-picker>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="8">
            <el-form-item label="身份证号码:" prop="id_card">
              <el-input size="mini" style="width: 210px" prefix-icon="el-icon-s-custom"
                        v-model="emp.id_card" placeholder="请输入身份证号码" clearable></el-input>
            </el-form-item>
          </el-col>

          <el-col :span="8">
            <el-form-item label="政治面貌:" prop="political">
              <el-select v-model="emp.political" placeholder="政治面貌" size="mini" style="width: 220px;">
                <el-option
                    v-for="item in politicals"
                    :key="item"
                    :label="item"
                    :value="item">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="民族:" prop="nation">
              <el-select v-model="emp.nation" placeholder="民族" size="mini" style="width: 250px;" filterable>
                <el-option
                    v-for="item in nations"
                    :key="item"
                    :label="item"
                    :value="item">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="8">
            <el-form-item label="籍贯:" prop="native_place">
              <el-input size="mini" style="width: 250px" prefix-icon="el-icon-suitcase"
                        v-model="emp.native_place" placeholder="请输入籍贯" clearable></el-input>
            </el-form-item>
          </el-col>

          <el-col :span="8">
            <el-form-item label="电话号码:" prop="phone">
              <el-input size="mini" style="width: 220px" prefix-icon="el-icon-phone"
                        v-model="emp.phone" placeholder="电话号码" clearable></el-input>
            </el-form-item>
          </el-col>

          <el-col :span="8">
            <el-form-item label="电子邮箱:" prop="email">
              <el-input size="mini" style="width: 220px" prefix-icon="el-icon-message"
                        v-model="emp.email" placeholder="请输入电子邮箱" clearable></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="身高:" prop="height">
              <el-input size="mini" style="width: 250px" type="number" prefix-icon="el-icon-edit"
                        v-model="emp.height" placeholder="请输入身高" clearable></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="血型:" prop="blood_type">
              <el-select v-model="emp.blood_type" placeholder="血型" size="mini" style="width: 250px;">
                <el-option v-for="item in blood_types" :key="item" :label="item" :value="item">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="婚姻状况:" prop="marital_status">
              <el-radio-group v-model="emp.marital_status">
                <el-radio label="已婚">已婚</el-radio>
                <el-radio label="未婚">未婚</el-radio>
                <el-radio label="离异">离异</el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="8">
            <el-form-item label="出生地:" prop="birthplace">
              <el-input size="mini" style="width: 237px" prefix-icon="el-icon-s-opportunity"
                        v-model="emp.birthplace" placeholder="请输入出生地" clearable></el-input>
            </el-form-item>
          </el-col>

          <el-col :span="8">
            <el-form-item label="户口所在地:" prop="registered_residence">
              <el-input size="mini" style="width: 210px" prefix-icon="el-icon-house"
                        v-model="emp.registered_residence" placeholder="请输入户口所在地" clearable></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="部门编号:" prop="department_number">
              <el-input size="mini" style="width: 223px" prefix-icon="el-icon-s-flag"
                        v-model="emp.department_number" type="number" clearable></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="部门名称:" prop="department_name">
              <el-select @change="changeEditSelect" v-model="emp.department_name" placeholder="请输入部门名称" size="mini" style="width: 223px" prefix-icon="el-icon-edit">
                <el-option
                    v-for="(item, index) in department_names"
                    :key="index"
                    :label="item"
                    :value="item">
                </el-option>
              </el-select>
              <!--                  <el-input size="mini" style="width: 100px" prefix-icon="el-icon-edit"-->
              <!--                            v-model="emp.department_name"></el-input>-->
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="岗位编号:" prop="post_number">
              <el-input size="mini" style="width: 223px" prefix-icon="el-icon-s-flag"
                        v-model="emp.post_number" type="number" clearable></el-input>
            </el-form-item>
          </el-col>

          <el-col :span="8">
            <el-form-item label="岗位名称:" prop="post_name">
              <el-select v-model="emp.post_name" placeholder="请输入岗位名称" size="mini" style="width: 223px" prefix-icon="el-icon-edit">
                <el-option
                    v-for="(item, index) in post_type_options"
                    :key="index"
                    :label="item"
                    :value="item">
                </el-option>
              </el-select>
              <!--                  <el-input size="mini" style="width: 100px" prefix-icon="el-icon-edit"-->
              <!--                            v-model="emp.post_name"></el-input>-->
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="8">
            <el-form-item label="入职日期:" prop="entry_date">
              <el-date-picker
                  v-model="emp.entry_date"
                  size="mini"
                  type="date"
                  value-format="yyyy-MM-dd"
                  style="width: 223px;"
                  placeholder="入职日期">
              </el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="用工形式:" prop="employment_form">
              <el-select v-model="emp.employment_form" placeholder="用工形式" size="mini" style="width: 223px;">
                <el-option v-for="item in employee_forms" :key="item" :label="item" :value="item"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="人员来源:" prop="personnel_source">
              <el-select v-model="emp.personnel_source" placeholder="人员来源" size="mini" style="width: 223px;">
                <el-option v-for="item in personnel_sources" :key="item" :label="item" :value="item"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="8">
            <el-form-item label="最高学历:" prop="highest_education">
              <el-select v-model="emp.highest_education" placeholder="最高学历" size="mini"
                         style="width: 223px;">
                <el-option
                    v-for="item in highest_educations"
                    :key="item"
                    :label="item"
                    :value="item">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="毕业院校:" prop="graduation_school">
              <el-input size="mini" style="width: 223px" prefix-icon="el-icon-school"
                        v-model="emp.graduation_school" placeholder="毕业院校名称" clearable></el-input>
            </el-form-item>
          </el-col>
          <!--            <el-col :span="8">-->
          <!--              <el-form-item label="所学专业:" prop="major_studied">-->
          <!--                <el-input size="mini" style="width: 223px" prefix-icon="el-icon-notebook-1"-->
          <!--                          v-model="emp.major_studied" placeholder="请输入专业名称" clearable></el-input>-->
          <!--              </el-form-item>-->
          <!--            </el-col>-->

          <el-col :span="8">
            <el-form-item label="毕业日期" prop="graduation_date">
              <el-date-picker
                  v-model="emp.graduation_date"
                  size="mini"
                  type="date"
                  value-format="yyyy-MM-dd"
                  style="width: 223px;"
                  placeholder="毕业日期">
              </el-date-picker>

            </el-form-item>
          </el-col>

                      <el-col :span="8">
                        <el-form-item label="外语语种:" prop="foreign_languages">
                          <el-select v-model="emp.foreign_languages" placeholder="外语语种" size="mini" style="width: 223px;">
                            <el-option
                                v-for="item in foreignsort"
                                :key="item"
                                :label="item"
                                :value="item">
                            </el-option>
                          </el-select>
                        </el-form-item>
                      </el-col>
          <el-col :span="8">
            <el-form-item label="外语语种熟练程度:" prop="foreign">
              <el-select v-model="emp.language_proficiency" placeholder="外语语种熟练程度" size="mini" style="width: 180px;">
                <el-option
                    v-for="item in foreign"
                    :key="item"
                    :label="item"
                    :value="item">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="是否离职" prop="is_quit" >
              <!--                <el-input size="mini" style="width: 100px" prefix-icon="el-icon-edit"-->
              <!--                          v-model="emp.is_quit" placeholder="是否离职" clearable></el-input>-->
              <el-radio-group v-model="emp.is_quit">
                <el-radio label="是">是</el-radio>
                <el-radio label="否">否</el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="8">
            <el-form-item label="起始年月" prop="starting_time">
              <el-date-picker
                  v-model="emp.starting_time"
                  size="mini"
                  type="date"
                  value-format="yyyy-MM-dd"
                  style="width: 223px;"
                  placeholder="起始年月">
              </el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="截至年月" prop="ending_time">
              <el-date-picker
                  v-model="emp.ending_time"
                  size="mini"
                  type="date"
                  value-format="yyyy-MM-dd"
                  style="width: 223px;"
                  placeholder="截至年月">
              </el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="所在单位:" prop="company_name">
              <el-input size="mini" style="width: 230px" prefix-icon="el-icon-school"
                        v-model="emp.company_name" placeholder="所在单位" clearable></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="8">
            <el-form-item label="从事工作内容:" prop="work_unit">
              <el-input size="mini" style="width: 203px" prefix-icon="el-icon-school"
                        v-model="emp.work_unit" placeholder="从事工作内容" clearable></el-input>
            </el-form-item>
          </el-col>

          <el-col :span="8">
            <el-form-item label="担任职务:" prop="position">
              <el-input size="mini" style="width: 230px" prefix-icon="el-icon-school"
                        v-model="emp.position" placeholder="担任职务" clearable></el-input>
            </el-form-item>
          </el-col>

          <el-col :span="8">
            <el-form-item label="月薪/年薪:" prop="salary">
              <el-input size="mini" style="width: 229px" prefix-icon="el-icon-school"
                        v-model="emp.salary" placeholder="月薪/年薪" clearable></el-input>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row>
          <el-col :span="8">
            <el-form-item label="证明人姓名:" prop="references">
              <el-input size="mini" style="width: 218px" prefix-icon="el-icon-user"
                        v-model="emp.references" placeholder="请输入证明人姓名" clearable></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="证明人职务:" prop="references_position">
              <el-input size="mini" style="width: 220px" prefix-icon="el-icon-school"
                        v-model="emp.references_position" placeholder="证明人职务" clearable></el-input>
            </el-form-item>
          </el-col>

          <el-col :span="8">
            <el-form-item label="证明人电话号码:" prop="references_telephone">
              <el-input size="mini" style="width: 196px" prefix-icon="el-icon-phone"
                        v-model="emp.references_telephone" placeholder="证明人电话号码" clearable></el-input>
            </el-form-item>
          </el-col>

        </el-row>
        <el-row>
          <el-col :span="8">
            <el-form-item label="关系人姓名:" prop="clan_name">
              <el-input size="mini" style="width: 210px" prefix-icon="el-icon-user"
                        v-model="emp.family_name" placeholder="请输入关系人姓名" clearable></el-input>
            </el-form-item>
          </el-col>
                      <el-col :span="8">
                        <el-form-item label="与本人关系:" prop="relationship_myself">
                          <el-select  v-model="emp.relationship_myself" placeholder="与本人关系" size="mini" style="width: 210px;">
                            <el-option
                                v-for="item in clan"
                                :key="item"
                                :label="item"
                                :value="item">
                            </el-option>
                          </el-select>
                        </el-form-item>
                      </el-col>
          <el-col :span="8">
            <el-form-item label="关系人所在单位:" prop="family_companyname">
              <el-input size="mini" style="width: 200px" prefix-icon="el-icon-school"
                        v-model="emp.family_companyname" placeholder="关系人所在单位" clearable></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="8">
            <el-form-item label="关系人职位:" prop="position">
              <el-input size="mini" style="width: 220px" prefix-icon="el-icon-school"
                        v-model="emp.position" placeholder="关系人职位" clearable></el-input>
            </el-form-item>
          </el-col>

          <el-col :span="8">
            <el-form-item label="关系人电话号码:" prop="telephone">
              <el-input size="mini" style="width: 200px" prefix-icon="el-icon-phone"
                        v-model="emp.telephone" placeholder="关系人电话号码" clearable></el-input>
            </el-form-item>
          </el-col>
          <!--            <el-col :span="8">-->
          <!--            <el-form-item label="是否离职" prop="is_quit" >-->
          <!--              &lt;!&ndash;                <el-input size="mini" style="width: 100px" prefix-icon="el-icon-edit"&ndash;&gt;-->
          <!--              &lt;!&ndash;                          v-model="emp.is_quit" placeholder="是否离职" clearable></el-input>&ndash;&gt;-->
          <!--              <el-radio-group v-model="emp.is_quit">-->
          <!--                <el-radio label="是">是</el-radio>-->
          <!--                <el-radio label="否">否</el-radio>-->
          <!--              </el-radio-group>-->
          <!--            </el-form-item>-->
          <!--          </el-col>-->
        </el-row>

      </el-form>
    </div>
    <span slot="footer" class="dialog-footer">
<!--          <el-tooltip :content="tipContent" effect="dark" placement="top-start">-->
      <!--            <el-button type="danger" size="mini">?</el-button>-->
      <!--            </el-tooltip>-->
        <template>
           <el-popover placement="bottom" title="注意事项" width="300" trigger="click" :content="tipContent">

        </el-popover>
        </template>
        <div class="test1">
              <el-button  type="primary" @click="doAddEmp" style="background-color: #19422e">确 定</el-button>
        </div>
            </span>
  </div>
</template>

<script>
// import {Message} from "element-ui";
import { Message } from "element-ui";
import {startLogin} from "@/router";

export default {
  name: "entry",
  data() {
    return {
      json_fields: {
        //导出Excel表格的表头设置
        '员工编号': 'id',
        '密码': 'password',
        '员工类型': 'employee_type',
        '姓名': 'name',
        '性别': 'sex',
        '出生日期': 'birthday',
        '身份证号': 'id_card',
        '政治面貌': 'political',
        '民族': 'nation',
        '籍贯': 'native_place',
        '电话': 'phone',
        '电子邮箱': 'email',
        '身高': 'height',
        '血型': 'blood_type',
        '婚姻状况': 'marital_status',
        '出生地': 'birthplace',
        '户口所在地': 'registered_residence',
        '部门编号': 'department_number',
        '部门名称': 'department_name',
        '岗位编号': 'post_number',
        '岗位名称': 'post_name',
        '入职日期': 'entry_date',
        '用工形式': 'employment_form',
        '人员来源': 'personnel_source',
        '最高学历': 'highest_education',
        '毕业院校': 'graduation_school',
        '所学专业': 'major_studied',
        '毕业日期': 'graduation_date',
        '是否离职': 'is_quit',
      },
      tipContent : "提示",
      currentPage: 1,
      pageSize: 10,
      searchValue: {
        political: null,
        nation: null,
        department_name : null,
        post_name : null,
        employment_form: null,
        graduation_school: null,
        major_studied: null
      },
      isAdd : false,
      title: '',
      importDataBtnText: '导入数据',
      importDataBtnIcon: 'el-icon-upload2',
      importDataDisabled: false,
      showAdvanceSearchView: false,
      allDeps: [],
      emps: [],
      loading: false,
      popVisible: false,
      popVisible2: false,
      dialogEditVisible: false,
      dialogAddVisible : false,
      dialogShowVisible : false,
      is_director : true,
      total: 0,
      page: 1,
      keyword: '',
      size: 10,
      birthday: '',
      post_number: null,
      post_name: '',
      department_names : ['开发部', '运维部', '测试部', '设计部', '策划部'],
      post_names : {
        '开发部' : ['C++开发', 'Java开发', 'C#开发', 'Python开发', 'Go开发'],
        '运维部' : ['云运维', '服务器运维'],
        '测试部' : ['系统测试', 'Bug测试'],
        '设计部' : ['UI设计', '动画设计'],
        '策划部' : ['策划', '系统策划'],
      },
      post_type_options : [],
      blood_type:'',
      blood_types:['A型', 'B型', 'AB型', 'O型', '其他'],
      employee_type:3,
      employee_types:['总裁', '主管', '员工'],
      nation: "",
      nations: [
        '蒙古族', '藏族', '苗族', '壮族', '回族', '维吾尔族', '彝族', '布依族',
        '朝鲜族', '侗族', '白族', '哈尼族', '傣族', '傈僳族', '畲族', '拉祜族',
        '满族', '瑶族', '土家族', '哈萨克族', '黎族', '佤族', '高山族', '水族',
        '东乡族', '景颇族', '土族', '仫佬族', '布朗族', '毛南族', '锡伯族', '普米族',
        '纳西族', '柯尔克孜族', '达斡尔族', '羌族', '撒拉族', '仡佬族', '阿昌族', '塔吉克族',
        '怒族', '俄罗斯族', '德昂族', '裕固族', '塔塔尔族', '鄂伦春族', '门巴族', '基诺族',
        '乌孜别克族', '鄂温克族', '保安族', '京族', '独龙族', '赫哲族', '珞巴族', '汉族',
        '其他',
      ],
      joblevels: [],
      political: "群众",
      politicals: ['群众', '共青团员', '中共预备党员', '中共党员', '无党派人士', '其他'],
      positions: [],
      highest_educations: ['小学', '初中', '中专/高中', '专科', '本科', '硕士', '博士', '其他'],
      employee_forms:['实习生', '正式职工'],
      personnel_source:'',
      personnel_sources:['校招', '社招'],
      clan:['父亲', '母亲', '配偶'],
      foreignsort:['英语', '俄语', '日语', '朝鲜语', '德语', '法语', '西班牙语', '意大利语', '葡萄牙语', '泰语'],
      foreign:['0 完全不懂', '1 少量，不能进行业务沟通', '2 有限的业务沟通', '3 一般，业务沟通仍受少量限制', '4 好，无困难进行谈判和演讲', '5 流利，在商务中自如地运用'],
      options: [{
        value: '选项1',
        label: '黄金糕'
      }, {
        value: '选项2',
        label: '双皮奶'
      }, {
        value: '选项3',
        label: '蚵仔煎'
      }, {
        value: '选项4',
        label: '龙须面'
      }, {
        value: '选项5',
        label: '北京烤鸭'
      }],
      inputDepName: '所属部门',
      emp: {
        id : "",
        password : "",
        employee_type : "",
        name : "",
        sex : "",
        birthday : "",
        id_card : "",
        political : "",
        nation : "",
        native_place : "",
        phone : "",
        email : "",
        height : null,
        blood_type :"",
        marital_status : "",
        birthplace : '',
        registered_residence : "",
        department_number : null,
        department_name : "",
        post_number : null,
        post_name : "",
        entry_date : "",
        employment_form : "",
        personnel_source : "",
        highest_education : "",
        graduation_school : "",
        major_studied : "",
        graduation_date : "",
        is_quit : "",

        Qualifying_result: "",
        Qualifying_remark:"",
        Qualifying_date:"",

        //职业生涯信息
        starting_time : "",
        ending_time : "",
        company_name : "",
        work_unit : "",
        fill_post : "",
        salary : "",
        references : "",
        references_position : "",
        references_telephone : "",
        //外语能力
        foreign_languages : "",
        language_proficiency : "",
        //社会关系
        relationship_myself : "",
        family_name : "",
        family_companyname : "",
        position : "",
        telephone : "",

        nationId: 1,
        politicId: 13,
        jobLevelId: 9,
        posId: 29,
        // workState: "在职",
        // contractTerm: 2,
        // conversionTime: "2018-03-31",
        // notworkDate: null,
        // beginContract: "2017-12-31",
        // endContract: "2019-12-31",
        // workAge: null,
      },
      defaultProps: {
        children: 'children',
        label: 'name'
      },
      rules: {
        id : [{required : true, message : '请输入编号', trigger : 'blur'}],
        password : [{required : true, message : '请输入密码', trigger : 'blur'}],
        employee_type : [{required : true, message : '请输入员工类型', trigger : 'blur'}],
        name: [{required : true, message : '请输入姓名', trigger : 'blur'}],
        sex: [{required : true, message : '请输入性别', trigger : 'blur'}],
        birthday: [{required : true, message : '请输入出生日期', trigger : 'blur'}],
        starting_time: [{required : true, message : '请输入起始年月', trigger : 'blur'}],
        ending_time: [{required : true, message : '请输入截至年月', trigger : 'blur'}],
        foreignsort: [{required : true, message : '请选择外语语种', trigger : 'blur'}],
        clan: [{required : true, message : '请选择关系', trigger : 'blur'}],
        clan_name: [{ trigger : 'blur'}],
        id_card: [{required : true, message : '请输入身份证号码', trigger : 'blur'}, {
          pattern : /(^[1-9]\d{5}(18|19|([23]\d))\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$)|(^[1-9]\d{5}\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{2}$)/,
          message : '身份证号码格式不正确',
          trigger : 'blur'
        }],
        political : [{required : true, message : '请输入政治面貌', trigger : 'blur'}],
        nation : [{required : true, message : '请输入民族', trigger : 'blur'}],
        native_place : [{required : true, message : '请输入籍贯', trigger : 'blur'}],
        phone : [{required : true, message : '请输入电话号码', trigger : 'blur'},
          {
            validator: function(rule, value, callback) {
              if (/^1[34578]\d{9}$/.test(value) == false) {
                callback(new Error("手机号格式不正确"));
              } else {
                callback();
              }
            },
            trigger: 'blur'
          }
        ],
        email : [{required : true, message : '请输入邮箱地址', trigger : 'blur'}, {
          type : 'email',
          message : '邮箱格式不正确',
          trigger : 'blur'
        }],
        height : [{required : true, message : '请输入身高', trigger : 'blur'}],
        blood_type : [{required : true, message : '请输入血型', trigger : 'blur'}],
        marital_status : [{required : true, message : '请输入婚姻状况', trigger : 'blur'}],
        birthplace : [{required : true, message : '请输入出生地', trigger : 'blur'}],
        registered_residence : [{required : true, message: '请输入户口所在地', trigger : 'blur'}],
        department_number : [{required : true, message : '请输入部门编号', trigger : 'blur'}],
        department_name : [{required : true, message : '请输入部门名称', trigger : 'blur'}],
        post_number : [{required : true, message : '请输入岗位编号', trigger : 'blur'}],
        post_name : [{required : true, message : '请输入岗位名称', trigger : 'blur'}],
        entry_date : [{required : true, message : '请输入入职日期', trigger : 'blur'}],
        employment_form : [{required : true, message : '请输入用工形式', trigger: 'blur'}],
        personnel_source : [{required : true, message : '请输入人员来源', trigger : 'blur'}],
        highest_education : [{required : true, message : '请输入最高学历', trigger : 'blur'}],
        graduation_school : [{required : true, message : '请输入毕业院校', trigger : 'blur'}],
        major_studied : [{required : true, message : '请输入所学专业', trigger : 'blur'}],
        graduation_date : [{required : true, message : '请输入毕业日期', trigger : 'blur'}],
        is_quit : [{required : true, message : '请输入是否离职', trigger : 'blur'}],

        nationId: [{required: true, message: '请输入您组', trigger: 'blur'}],
        jobLevelId: [{required: true, message: '请输入职称', trigger: 'blur'}],
        posId: [{required: true, message: '请输入职位', trigger: 'blur'}],
        // workState: [{required: true, message: '请输入工作状态', trigger: 'blur'}],
        // contractTerm: [{required: true, message: '请输入合同期限', trigger: 'blur'}],
        // conversionTime: [{required: true, message: '请输入转正日期', trigger: 'blur'}],
        // notworkDate: [{required: true, message: '请输入离职日期', trigger: 'blur'}],
        // beginContract: [{required: true, message: '请输入合同起始日期', trigger: 'blur'}],
        // endContract: [{required: true, message: '请输入合同结束日期', trigger: 'blur'}],
        // workAge: [{required: true, message: '请输入工龄', trigger: 'blur'}],
      },
      multipleSelectionFlag : false,
      multiDeleteVisible : false,
      multipleSelection : '',
      filterDepartmentText : [],
      filterPostText : [],
      value1: "",
      value2: "",
      dateRules : {
        value : [{required : true, message : '请输入开始和结束日期', trigger : 'blur'}],
        value1 : [{required : true, message : '请输入开始日期', trigger : 'blur'}],
        value2 : [{required : true, message : '请输入结束日期', trigger : 'blur'}],
      },
      pickerOptions0: {
        disabledDate: (time) => {
          if (this.value2 !== "") {
            return time.getTime() > Date.now() || time.getTime() > this.value2;
          } else {
            return time.getTime() > Date.now();
          }
        }
      },
      pickerOptions1: {
        disabledDate: (time) => {
          return time.getTime() < this.value1 || time.getTime() > Date.now();
        }
      },
      showDateSearchView : false,
    }
  },
  mounted() {
    this.initEmps();
    this.initData();
    this.initDepartment();
    this.initPost();
    this.initSearchText();
    this.tipContent = '部门和岗位的编号与名称请一一对应！！！ 例如:部门编号-部门名称(岗位1编号-岗位1名称, 岗位2编号-岗位2名称) 1000-开发部(10-C++开发, 11-Java开发, 12-C#开发, 13-Python开发, 14-Go开发), 1001-运维部(20-云运维, 21-服务器运维), 1002-测试部(30-Bug测试, 31-系统测试), 1003-设计部(40-UI设计, 41-动画设计), 1004-策划部(50-策划, 51-系统策划)';

    localStorage.setItem("type", this.emp.employee_type);
    // this.initPositions();
  },
  computed : {
    empsData() {
      console.log("emps.length = ", this.emps.length);
      if (this.emps.length > 0) {
        return this.emps.slice( (this.currentPage -1) * this.pageSize, this.currentPage * this.pageSize) || [];
      }
      console.log("emps = ", this.emps);
      return this.emps;
    }
  },
  methods: {
    searvhViewHandleNodeClick(data) {
      this.inputDepName = data.name;
      this.searchValue.department_number = data.id;
      this.popVisible2 = !this.popVisible2
    },
    onError(err, file, fileList) {
      console.log("执行Error");
      this.importDataBtnText = '导入数据';
      this.importDataBtnIcon = 'el-icon-upload2';
      this.importDataDisabled = false;
    },
    onSuccess(response, file, fileList) {
      console.log("执行Success");
      this.importDataBtnText = '导入数据';
      this.importDataBtnIcon = 'el-icon-upload2';
      this.importDataDisabled = false;
      this.initEmps();
    },
    beforeUpload(file) {
      const isType = file.type === 'application/vnd.ms-excel'
      const isTypeComputer = file.type === 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'
      const fileType = isType || isTypeComputer
      if(!fileType) {
        this.$message.error('上传文件只能是xls/xlsx格式！')
      }
      this.importDataBtnText = '正在导入';
      this.importDataBtnIcon = 'el-icon-loading';
      this.importDataDisabled = true;
      return fileType
    },
    uploadHttpRequest(param) {
      const formData = new FormData()
      formData.append('file', param.file)
      formData.append('uploadType', this.rules)
      const url = `/EmployeeBasic/Import`
      console.log("param = ", param);
      console.log("formData = ", formData);
      this.$axios.post(url, formData).then(resp => {
        const {data : {code, mark}} = resp
        if (code == 200) {
          param.onSuccess();
          Message.success({message : '导入成功'});
        } else {
          param.onError();
          Message.error({message : resp.data.msg});
          console.log(resp.data.msg);
        }
        this.initEmps();
      }).catch(err => {
        console.log("上传失败，", err)
        param.onError();
        Message.error({message : resp.data.msg});
      })
    },
    exportData() {
      // window.open('/employee/basic/export', '_parent');
      window.open('/EmployeeBasic/Export', '_parent');
    },
    // formatJson(filterVal, jsonData) {
    //   return jsonData.map(v => filterVal.map(j => v[j]))
    // },
    // export2Excel() {
    //   require.ensure([], () => {
    //     const { export_json_to_excel } = require('@/excel/Blob')
    //     const tHeader = [
    //         '员工编号', '密码', '员工类型', '姓名', '性别', '出生日期', '身份证号', '政治面貌',
    //         '民族', '籍贯', '电话', '电子邮箱', '身高', '血型', '婚姻状况',
    //         '出生地', '户口所在地', '部门编号', '部门名称', '岗位编号', '岗位名称', '入职日期',
    //         '用工形式', '人员来源', '最高学历', '毕业院校', '所学专业', '毕业日期', '是否离职'
    //     ];
    //     const filterVal = [
    //         'id', 'password', 'employee_type', 'name','sex', 'birthday', 'id_card', 'political',
    //         'nation', 'native_place', 'phone', 'email', 'height', 'blood_type', 'marital_status',
    //         'birthplace', 'registered_residence', 'department_number', 'department_name', 'post_number', 'post_name', 'entry_date',
    //         'employment_form', 'personnel_source', 'highest_education', 'graduation_school', 'major_studied', 'graduation_date', 'is_quit'
    //     ];
    //     const list = this.emps;
    //     const data = this.formatJson(filterVal,list);
    //     export_json_to_excel(tHeader, data, '员工信息表');
    //   });
    // },
    emptyEmp() {
      this.emp = {
        id : "",
        password : "",
        employee_type : "",
        name : "",
        sex : "",
        birthday : "",
        id_card : "",
        political : "",
        nation : "",
        native_place : "",
        phone : "",
        email : "",
        height : null,
        blood_type :"",
        marital_status : "",
        birthplace : '',
        registered_residence : "",
        department_number : null,
        department_name : "",
        post_number : null,
        post_name : "",
        entry_date : "",
        employment_form : "",
        personnel_source : "",
        highest_education : "",
        graduation_school : "",
        major_studied : "",
        graduation_date : "",
        is_quit : "",
        Qualifying_result: "",
        Qualifying_remark:"",
        Qualifying_date:"",
        //职业生涯信息
        starting_time : "",
        ending_time : "",
        company_name : "",
        work_unit : "",
        fill_post : "",
        salary : "",
        references : "",
        references_position : "",
        references_telephone : "",
        //外语能力
        foreign_languages : "",
        language_proficiency : "",
        //社会关系
        relationship_myself : "",
        family_name : "",
        family_companyname : "",
        position : "",
        telephone : "",


        nationId: 1,
        politicId: 13,
        jobLevelId: 9,
        posId: 29,

        // contractTerm: 2,
        // conversionTime: "",
        // notworkDate: null,
        // beginContract: "",
        // endContract: "",
        // workAge: null
      }
      this.inputDepName = '';

    },
    showAllData(data) {
      this.title = '查看员工信息';
      this.emp = data;
      this.dialogShowVisible = true;
    },
    showEditEmpView(data) {
      // this.initPositions();
      this.title = '编辑员工信息';
      this.emp = data;
      this.inputDepName = data.department_name;
      this.dialogEditVisible = true;
    },
    changeSelect() {
      // 清空部门内容
      this.searchValue.post_name = ''

      // 遍历部门的下拉选项数组
      for (const k in this.department_names) {
        // 岗位名称 是否等于 部门名称的下拉选择数组中的某一项
        if (this.searchValue.department_name === this.department_names[k]) {
          this.post_type_options = this.post_names[this.searchValue.department_name]
        }
      }
      console.log("post_type_options = "+this.post_type_options);
    },
    changeEditSelect() {
      // 清空部门内容
      this.emp.post_name = ''

      // 遍历部门的下拉选项数组
      for (const k in this.department_names) {
        // 岗位名称 是否等于 部门名称的下拉选择数组中的某一项
        if (this.emp.department_name === this.department_names[k]) {
          this.post_type_options = this.post_names[this.emp.department_name]
        }
      }
      console.log("post_type_options = "+this.post_type_options);
    },
    // showAddEmpView(data) {
    //   this.title = '添加员工信息';
    //   this.emp = data;
    //   this.inputDepName = data.department_name;
    //   this.dialogAddVisible = true;
    // },
    deleteEmp(data) {
      console.log(localStorage.getItem("role"))
      if (localStorage.getItem("role") === "主管" && (data.employee_type === "总裁" || data.employee_type === "主管")) {
        Message.error({message : "不能删除同级权限或更高的用户"});
      } else if (localStorage.getItem("role") === "员工" && (data.employee_type === "总裁" || data.employee_type === "主管")) {
        Message.error({message : "员工没有删除领导的权限"});
      } else {
        var currentId = localStorage.getItem("id");
        if (currentId != data.id) {
          this.$confirm('此操作将永久删除【' + data.name + '】, 是否继续?', '提示', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'warning'
          }).then(() => {
            this.$axios.post("/EmployeeBasic/Delete", data).then(resp => {
              if (resp) {
                this.initEmps();
                Message.success({message : "删除成功"});
              } else {
                Message.error({message : resp.data.msg});
              }
            })
          }).catch(() => {
            // this.$message({
            //   type: 'info',
            //   message: '已取消删除'
            // });
            Message.info({message : "已取消删除"});
          });
        } else {
          Message.error({message : "不能删除自己"});

        }
      }
    },
    doEditEmp() {
      //编辑
      this.$refs['empForm'].validate(valid => {
        if (valid) {
          this.emp.height = parseInt(this.emp.height);
          this.$axios.post('/EmployeeBasic/Update', this.emp).then(resp => {
            if (resp) {
              this.dialogEditVisible = false;
              this.initEmps();
              Message.success({message : '修改成功!'});
            } else {
              Message.error({message : resp.data.msg});
            }
          });
        }
      });

    },
    doAddEmp() {
      this.$refs['empForm'].validate(valid => {
        if (valid) {
          console.log(this.emp);
          this.emp.height = parseInt(this.emp.height);
          this.emp.department_number = parseInt(this.emp.department_number);
          this.emp.post_number = parseInt(this.emp.post_number);
          this.emp.id = '20220001'
          this.$axios.post('/EmployeeBasic/EmployeeAdd', this.emp).then(resp => {
            if (resp) {
              this.dialogAddVisible = false;
              this.initEmps();
              if (resp.data.msg === "新增成功") {
                Message.success({message : '添加成功'});
              } else {
                Message.error({message : resp.data.msg})
              }

            } else {
              Message.error({message : resp.data.msg});
            }
          })
        }
      });
    },
    handleNodeClick(data) {
      this.inputDepName = data.name;
      this.emp.department_number = data.id;
      this.popVisible = !this.popVisible
    },
    showDepView() {
      this.popVisible = !this.popVisible
    },
    showDepView2() {
      this.popVisible2 = !this.popVisible2
    },
    initPositions() {
      // this.getRequest('/employee/basic/positions').then(resp => {
      //     if (resp) {
      //         this.positions = resp;
      //     }
      // })
      this.$axios.post('/EmployeeBasic/Position').then(resp => {
        if (resp) {
          this.positions = resp;
        }
      })
    },
    getMaxWordID() {
      this.getRequest("/employee/basic/maxid").then(resp => {
        if (resp) {
          this.emp.id = resp.obj;
        }
      })
    },
    initData() {
      // if (!window.sessionStorage.getItem("nations")) {
      //     this.getRequest('/employee/basic/nations').then(resp => {
      //         if (resp) {
      //             this.nations = resp;
      //             window.sessionStorage.setItem("nations", JSON.stringify(resp));
      //         }
      //     })
      // } else {
      //     this.nations = JSON.parse(window.sessionStorage.getItem("nations"));
      // }
      // if (!window.sessionStorage.getItem("joblevels")) {
      //     this.getRequest('/employee/basic/joblevels').then(resp => {
      //         if (resp) {
      //             this.joblevels = resp;
      //             window.sessionStorage.setItem("joblevels", JSON.stringify(resp));
      //         }
      //     })
      // } else {
      //     this.joblevels = JSON.parse(window.sessionStorage.getItem("joblevels"));
      // }
      // if (!window.sessionStorage.getItem("political")) {
      //     this.getRequest('/employee/basic/political').then(resp => {
      //         if (resp) {
      //             this.political = resp;
      //             window.sessionStorage.setItem("political", JSON.stringify(resp));
      //         }
      //     })
      // } else {
      //     this.political = JSON.parse(window.sessionStorage.getItem("political"));
      // }
      // if (!window.sessionStorage.getItem("deps")) {
      //     this.getRequest('/employee/basic/deps').then(resp => {
      //         if (resp) {
      //             this.allDeps = resp;
      //             window.sessionStorage.setItem("deps", JSON.stringify(resp));
      //         }
      //     })
      // } else {
      //     this.allDeps = JSON.parse(window.sessionStorage.getItem("deps"));
      // }
    },
    sizeChange(currentSize) {
      this.pageSize = currentSize;
      this.initEmps();
    },
    currentChange(currentPage) {
      this.currentPage = currentPage;
      this.initEmps('advanced');
    },
    showAddEmpView() {
      this.emptyEmp();
      this.title = '添加员工信息';
      //this.getMaxWordID();
      this.dialogAddVisible = true;
    },
    async searchEmp(data) {
      console.log("name = ", this.emp.name);
      var url;
      if (localStorage.getItem("role") === "总裁") {
        url = '/EmployeeBasic/Search';
        this.$refs[data].validate((valid) => {
          if (valid) {
            this.$axios.post(url, this.emp).then((resp) => {
              if (resp.data.msg == "查询成功") {
                this.emps = resp.data.data;
              } else {
                Message.error({message : resp.data.msg});
              }
            });
          }
        })
      } else if (localStorage.getItem("role") === "主管") {
        url = '/EmployeeBasic/SearchByDirector';
        var temp = {
          'id' : localStorage.getItem("id"),
          'name' : this.emp.name,
        };
        this.$refs[data].validate((valid) => {
          if (valid) {
            this.$axios.post(url, temp).then((resp) => {
              if (resp.data.msg == "查询成功") {
                this.emps = resp.data.data;
              } else {
                Message.error({message : resp.data.msg});
              }
            });
          }
        })
      } else {
        url = '/EmployeeBasic/SearchByEmployee';
        var temp = {
          'id' : localStorage.getItem("id"),
          'name' : this.emp.name,
        };
        this.$refs[data].validate((valid) => {
          if (valid) {
            this.$axios.post(url, temp).then((resp) => {
              if (resp.data.msg == "查询成功") {
                this.emps = resp.data.data;
              } else {
                Message.error({message : resp.data.msg});
              }
            });
          }
        })
      }


    },
    resetForm(data) {
      console.log("data = ", data, "emp = ", this.emp)
      this.$refs[data].resetFields();
      this.initEmps();
    },
    async searchEmpAdvance(data) {
      this.$refs[data].validate((valid) => {
        if (valid) {
          this.$axios.post('/EmployeeBasic/SearchAdvance', this.searchValue).then((resp) => {
            if (resp.data.msg == "查询成功") {
              this.emps = resp.data.data;
            } else {
              Message.error({message : resp.data.msg});
            }
          })
        }
      })
    },
    initEmps(type) {
      this.loading = true;
      var tempRole = localStorage.getItem("role");
      if (tempRole === "总裁") {
        this.$axios.post('/EmployeeBasic').then(resp => {
          this.loading = false;
          if (resp) {
            this.emps = resp.data;
            console.log("resp = ", this.emps);
            this.total = resp.total;
          }
        })
      } else if (tempRole === "主管") {
        let temp = {
          id : "",
        }
        temp.id = localStorage.getItem("id");
        this.$axios.post('/EmployeeBasicByDirector', temp).then(resp => {
          this.loading = false;
          if (resp) {
            this.emps = resp.data;
            console.log("resp = ", this.emps);
            this.total = resp.total;
          }
        })
      } else {
        this.is_director = false;
        let temp = {
          id : "",
        }
        temp.id = localStorage.getItem("id");
        this.$axios.post('/EmployeeBasicByEmployee', temp).then(resp => {
          this.loading = false;
          if (resp) {
            this.emps = resp.data;
            console.log("resp = ", this.emps);
            this.total = resp.total;
          }
        })
      }

    },
    handleSelectionChange(val) {
      // console.log(val);
      this.multipleSelection = val;
      this.multipleSelectionFlag = true;
      if (this.multipleSelection.length == 0) {
        // 如不进行判断则勾选完毕后批量删除按钮还是会在
        this.multipleSelectionFlag = false;
      }
    },
    popDelete() {
      this.multiDeleteVisible = true;
    },
    multiDelete() {
      this.multiDeleteVisible = false;
      let checkArr = this.multipleSelection;   // multipleSelection存储了勾选到的数据
      let params = [];
      let self = this;
      let flag = true;
      checkArr.forEach(function (item) {
        if (localStorage.getItem("id") === item.id) {//不能删除自己
          console.log("不能删除自己");
          flag = false;
        } else if (localStorage.getItem("role") === "主管" && item.employee_type === "主管") {//身份为主管，不能删除其他主管
          console.log("执行力第二个false");
          flag = false;
        } else {
          params.push(item.id);       // 添加所有需要删除数据的id到一个数组，post提交过去
        }
      });
      if (flag === true) {
        console.log("批量删除的id：", params);

        //  $http即是axios，可以在main.js里面设置 Vue.prototype.$http = axios;
        this.$axios.post('/EmployeeBasic/MultiDelete', params).then(function (res) {
          if (res.data.msg == "删除成功") {
            Message.success({message : "批量删除成功"});
          } else {
            Message.error({message : resp.data.msg});
          }
          // self.getFashionList(1, 1, 5);
        })
        this.initEmps();
      } else {
        Message.error({message : "不能删除自己和其他主管"});
        this.initEmps();
      }
      this.initEmps();

    },
    initDepartment() {
      this.$axios.post('/Department/Init').then(resp => {
        this.department_names = resp.data;
        console.log("初始化部门：", this.department_names);
      })
    },
    initPost() {
      var temp = {
        "department_name" : this.department_name
      }
      this.$axios.post('/Post/Init', temp).then(resp => {
        this.post_names = resp.data;
        console.log("初始化岗位：", this.post_names);
      })
    },
    filterHandler(value, row, column) {
      const property = column['property'];
      return row[property] === value;
    },
    initSearchText() {
      // this.filterDepartmentText = [
      //   {text : 1001, value : 1001},
      // ]
      this.$axios.post('/SearchByDepartmentNumber').then(resp => {
        this.filterDepartmentText = resp.data;
        console.log("Text : ", this.filterDepartmentText);
      })
      this.$axios.post('/SearchByPostNumber').then(resp => {
        this.filterPostText = resp.data;
        console.log("Text : ", this.filterPostText);
      })
    },
    selectDate() {
      if ((this.value1 === "" || this.value1 === null) || (this.value2 === "" || this.value2 === null)) {
        Message.error({message : '请输入开始和结束日期'});
      } else {
        console.log("value1 = ", this.value1);
        var url;
        if (localStorage.getItem("role") === "总裁") {
          url = '/EmployeeBasic/SearchDate';
        } else if (localStorage.getItem("role") === "主管") {
          url = '/EmployeeBasic/SearchDateByDirector';
        } else {
          url = '/EmployeeBasic/SearchDateByEmployee';
        }
        var temp = {
          'id' : localStorage.getItem("id"),
          'start' : this.value1,
          'end' : this.value2,
        }
        this.$axios.post(url, temp).then(resp => {
          if (resp.data.data) {
            this.emps = resp.data.data;
            Message.success({message : '查询成功'});
          } else {
            Message.warning({message : '未找到符合条件的信息'});
          }
        })
        // this.initEmps();
      }

    },
    resetDate() {
      this.value1 = ""
      this.value2 = ""
      this.initEmps();
    }
  }
}
</script>

<style>
/* 可以设置不同的进入和离开动画 */
/* 设置持续时间和动画函数 */
.test1{
  padding-left: 1000px;
}
.slide-fade-enter-active {
  transition: all .8s ease;
}

.slide-fade-leave-active {
  transition: all .8s cubic-bezier(1.0, 0.5, 0.8, 1.0);
}

.slide-fade-enter, .slide-fade-leave-to
  /* .slide-fade-leave-active for below version 2.1.8 */
{
  transform: translateX(10px);
  opacity: 0;
}
</style>
